/* color palette from <https://github.com/vuejs/theme> */
:root {
  /* es框架基础自定义 */

  --es-border-radius-base: 4px;
  --es-border-radius-round: 20px;
  --es-border-radius-circel: 100%;
  --es-border-width: 1px;
  --es-border-style: solid;
  --es-size--large: 40px;
  --es-size--default: 32px;
  --es-size--small: 24px;
  --es-size--mini: 20px;
  --es-box-shadow: 0 0 0 1px;

  --es-white--color: #fff;
  --es-black--color: #181818;
  --es-black--color--1:#A8ABB2;
  --es-black--color--2: #E4E7ED;

  --es-default--color: #14c3da;
  --es-default--color--light--1: #70ceda;
  --es-default--color--light--2: #9dd9e1;
  --es-default--color--light--3: #9ccad0;
  --es-default--color--light--4: #add1d5;
  --es-default--color--light--5: #eff5f5;
  --es-default--color--dark--1: #0bbad1;

  --es-success--color: #67c23a;
  --es-success--color--light--1: #8cc670;
  --es-success--color--light--2: #b3e19d;
  --es-success--color--light--3: #d1edc4;
  --es-success--color--light--4: #e1f3d8;
  --es-success--color--light--5: #f0f9eb;
  --es-success--color--dark--1: #529b2e;

  --es-warning--color: #e6a23c;
  --es-warning--color--light--1: #deb578;
  --es-warning--color--light--2: #f3d19e;
  --es-warning--color--light--3: #f8e3c5;
  --es-warning--color--light--4: #faecd8;
  --es-warning--color--light--5: #fdf6ec;
  --es-warning--color--dark--1: #b88230;

  --es-error--color: #f56c6c;
  --es-error--color--light--1: #f19c9c;
  --es-error--color--light--2: #fab6b6;
  --es-error--color--light--3: #fcd3d3;
  --es-error--color--light--4: #fde2e2;
  --es-error--color--light--5: #fef0f0;
  --es-error--color--dark--1: #c45656;

  --es-info--color: #909399;
  --es-info--color--light--1: #b1b3b8;
  --es-info--color--light--2: #c8c9cc;
  --es-info--color--light--3: #dedfe0;
  --es-info--color--light--4: #e9e9eb;
  --es-info--color--light--5: #f4f4f5;
  --es-info--color--dark--1: #73767a;

  --es-transition-duration-fast: .2s;
  --es-transition-function-ease-in-out-bezier: cubic-bezier(.645, .045, .355, 1);

  --es-disabled-bg-color: var(--es-black--color--2);
  --es-disabled-border-color: var(--es-black--color--1);
  /* 按钮 */
  --es-button--default: var(--es-default--color);
  --es-button--default--hover: var(--es-default--color--light--1);
  --es-button--default--active: var(--es-default--color--dark--1);
  --es-button--default--disabled: var(--es-default--color--light--2);

  --es-button--success: var(--es-success--color);
  --es-button--success--hover: var(--es-success--color--light--1);
  --es-button--success--active: var(--es-success--color--dark--1);
  --es-button--success--disabled: var(--es-success--color--light--2);

  --es-button--warning: var(--es-warning--color);
  --es-button--warning--hover: var(--es-warning--color--light--1);
  --es-button--warning--active: var(--es-warning--color--dark--1);
  --es-button--warning--disabled: var(--es-warning--color--light--2);

  --es-button--error: var(--es-error--color);
  --es-button--error--hover: var(--es-error--color--light--1);
  --es-button--error--active: var(--es-error--color--dark--1);
  --es-button--error--disabled: var(--es-error--color--light--2);

  --es-button--disabled-text-color: var(--es-white--color);

  /* 输入框 */
  --es-input-bg-color: var(--es-white--color);
  --es-transition-box-shadow: box-shadow var(--es-transition-duration-fast) var(--es-transition-function-ease-in-out-bezier);
  --es-input-hover-box-shadow: var(--es-box-shadow) var(--es-info--color--light--1) inset;
  --es-input-box-shadow: var(--es-box-shadow) var(--es-info--color--light--3) inset;
  --es-input-disabled-text-color: var(--es-black--color--1);
}
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  position: relative;
  font-weight: normal;
}

body {
  min-height: 100vh;
  color: var(--color-text);
  background: var(--color-background);
  transition: color 0.5s, background-color 0.5s;
  line-height: 1.6;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue",
    sans-serif;
  font-size: 15px;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
